<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>注册</title>
<style type="text/css">
            input[type = "text"], input[type = "password"] {
                width: 150px;
            }
			table{
			background-color:pink}
        </style>

</head>

<body>
<div>
 
 
       
    <center>
      <form name="myform" action="success.html" method="post" onsubmit="return check()" >
          
		  	<table width="45%" height="50%" cellspacing="0"  >
<tr>        
        <th colspan="2">注册会员(*为必填的空！)</th>	
  		      </tr>	  		
		  		   <tr>
		  		   	  <td height="36" align="right">会员号</td>
      <td>
		  <input type="text" name="username" id="username" onBlur="check()" />
                     <span id="usernames"></span>		*  </td>
  		      </tr>
		  		   <tr>
		  		      <td height="38" align="right">设置密码：</td>	
	  		         <td>
  		             <input type="password" name="psw" id="psw" onBlur="check()"/>
                     <span id="psws"></span>				   					 * </td>
  		      </tr>
               <tr>
       <td align="right" >密码确认：</td>
       <td>
       <input type="password" name="psw-enter" id="psw-enter" onBlur="passwords()"/><span id="psws-enter"></span>             *</td>
         </tr>

        <tr>
		  		   	  
		  		      <td height="41" align="right">性别：</td>	
<td>
		  		         
          <input type="radio" name="sex" value="man" checked />
		  		          男 &nbsp;&nbsp;&nbsp;
		  		          <input type="radio" name="sex" value="women"/>
	  		          女	  		         </td>
  		      </tr>
		  		  
				     <tr>
		  		   	   <td height="32" align="right">身份证号码：</td>
<td>
		  		   	       
	      <input type="text" value="" id="sfz" onBlur="check()" />
                           <span id="shen"></span>						   		  		   	  * </td>
  		      </tr>
		  		   <tr>
		  		   	   <td height="44" align="right">联系电话：</td>
<td>
		  		   	      
	      <input type="text" value="" id="phone" onBlur="check()" />
                           <span id="phones"></span>						  		  		   	  * </td>
  		      </tr>
		  		   <tr>
		  		       <td height="39" align="right">Emai：</td>	
<td>
		  		          
		  <input type="text" id="email" value="" onBlur="check()"/>
                          <span id="emails"></span>						 		  		       *</td>
              <tr>
		  		   	    <td align="right">备注：  </td>	
<td>
		  		   	      <font color="#6600CC">
		  		   	      <textarea id="jian">
		  		   	      	</textarea>	
		  		   	      </font></td>
  		   	  </tr>
  		      
   	   <tr>
		  		   	   <td colspan="2" align="center"> 
		  		   	   	 
                           <input type="submit" value="提交"  />
                            &nbsp;&nbsp;&nbsp;&nbsp;
		  		   	   	   
		  		   	   	   <input type="reset" value="重置" />
	  		   	   	       </font></td>	
  		   	  </tr>
		  	</table>
          
  </form>
  </center>
   <script type="text/javaScript">
		     function	 username(){
			
		     	   var username = document.getElementById("username").value;  //用户名
				 //用户名的判断
				 var r = /^[A-Za-z]+$/;
                  
                   if(username == ""){	     	    			     	    	
		     	  	    document.getElementById("usernames").innerHTML = "<font color='red'>用户名不可以为空</font>";
		     	  	    return false;
		     	    }  
					 
					else if(username !="")
					{
				      	 if(username.length<3)
						  {
						   document.getElementById("usernames").innerHTML = "<font color='red'>用户名至少3位</font>";
							return false;
						  }
						 else{
								    document.getElementById("usernames").innerHTML = "<font color='green'>恭喜你，您的用户名可以使用</font>";
										return true;
							 }
		     	    
		     	        }
					}
					function password()
					{
							var psw = document.getElementById("psw").value;  
						   //密码				//密码的判断
						 if(psw=="")
						 {
				
								 document.getElementById("psws").innerHTML = "<font color='red'>密码不可以为空</font>";
								  return false;
						}
						else if(psw !="")
						{
							  if(psw.length<6)
							  {
							   document.getElementById("psws").innerHTML = "<font color='red'>密码至少六位</font>";
							   return false;
							  }
							  else{
								  document.getElementById("psws").innerHTML = "<font color='green'>密码设置成功！</font>";
									return true;
							  }
						
						}
				}
				function passwords()
				{
					var psw = document.getElementById("psw").value;  
					var p=document.getElementById("psw-enter").value;
					if(p!=psw)
					{
						document.getElementById("psws-enter").innerHTML = "<font color='red'>密码与确认密码不同</font>";
					}
					else{
						document.getElementById("psws-enter").innerHTML = "<font color='green'>确认密码输入正确</font>";
						}
				}
			
 
              

              function sex(){
		     	   var sex = document.getElementsByName("sex");		     	   
		     	   var sex1 = "";
		     	    for(var i=0;i<sex.length;i++){
		     	      if(sex[i].checked==true){
		     	   	     sex1 = sex[i].value;
		     	      } 	    
		     	    }
					}
					function shijizn(){
		     	   var year = document.getElementById("year").value;  //出生年份
		     	   var month= document.getElementById("month").value;  //出生月份
		     	   var day = document.getElementById("day").value;   //出生的日期
					
					}
				//身份证的验证
				function sfz(){
				var sfz = document.getElementById("sfz").value;//身份证号码
				var shenfenz=/\d{15}|\d{18}/;
				if(sfz==""){
				 document.getElementById("shen").innerHTML = "<font color='red'>身份证不能为空</font>";
						 return false;
				}
				if(sfz !="")
				{
				    if(!(shenfenz.test(sfz)))
                      {
					    document.getElementById("shen").innerHTML = "<font color='red'>身份证格式不正确</font>";
						 return false;
					  }
					  else{
                          document.getElementById("shen").innerHTML = "<font color='green'>身份证正确</font>";			
						   return true;
					  }
					  
				}
				}
				function phone()
				{
		     	   var phone = document.getElementById("phone").value;  //联系电话
		     	   
		     	   //正则表达式使用方法
		     	   var reg= /^\d{11}$/;   //
				   if(phone==""){
				    document.getElementById("phones").innerHTML = "<font color='red'>联系电话格不能为空</font>";
								   return false;
				   }
				   if(phone !="")
				   {
						   if(!(reg.test(phone))){
		     	   				  document.getElementById("phones").innerHTML = "<font color='red'>联系电话格式不正确</font>";
								   return false;
		     					  }
							 else {
									 document.getElementById("phones").innerHTML = "<font color='green'>联系电话输入正确</font>";
									  return true;
									  }
				   }
		     	  }
		     	   
		     	   
		     	  function email()
				  {
		     	   var email = document.getElementById("email").value;  //email邮箱
		     	    //alert(email);
					//邮箱验证
                        var e=/^\w+([-+.]\w+)*@\w+([-.]\\w+)*\.\w+([-.]\w+)*$/;
						if(email=="")
						{
						 document.getElementById("emails").innerHTML = "<font color='red'>邮箱不能为空</font>";		
								    return false;
						}
						if(email !="")
						{
							if(!(e.test(email)))
							{
								   document.getElementById("emails").innerHTML = "<font color='red'>邮箱格式不正确</font>";		
								    return false;
							}
							else{
									document.getElementById("emails").innerHTML = "<font color='green'>邮箱正确</font>";		
									 return true;
								}
						}
						}
						
		     	  
		     	     	   
		     	       	      
			   function check(){
                if (username()&&password()&&sfz()&&phone()&&email()) {
                    return true;
                }
                else {
                    return false;
                }
            }
			
		  </script>
</body>
</html>
